define(['map'], function(map) {
    'use strict';
    
    function Line(matadata) {
        this.matadata = matadata;
        this.echartslayer = new ol3Echarts(null, {
            hideOnMoving: true,
            hideOnZooming: true
        });
        this.echartslayer.appendTo(map.getMap());
    }

    Line.prototype.setMateData = function (matadata) {
        this.matadata = matadata;
    }

    Line.prototype.init = function () {
        this.options = {
            xAxis: [],
            yAxis: [],
            grid: [],
            series: [],
            animation: false,
            tooltip: {
                trigger: 'axis'
            },
        };
        this.matadata.forEach((item, index) => {
            this.options.xAxis.push({
                id: index,
                gridId: index,
                type: 'category',
                name: item["name"],
                nameTextStyle: {
                    color: '#fff',
                    fontSize: 15,
                    // backgroundColor: "#fff"
                },
                nameLocation: 'middle',
                nameGap: 3,
                splitLine: {show: false},
                axisTick: {show: false},
                axisLabel: {show: false},
                axisLine: {
                    onZero: false,
                    lineStyle: {
                        color: '#000'
                    }
                },
                data: item["data"]["xaxis"],
                z: 100
            });

            this.options.yAxis.push({
                id: index,
                gridId: index,
                splitLine: {show: false},
                axisTick: {show: false},
                axisLabel: {show: false},
                axisLine: {
                    lineStyle: {
                        color: '#bbb'
                    }
                },
                z: 100
            });

            this.options.grid.push({
                id: index,
                // 调整表格的size
                width: item["size"][0],
                height: item["size"][1],
                z: 100
            });

            this.options.series.push({
                id: index,
                type: 'line',
                xAxisId: index,
                yAxisId: index,
                data: item["data"]["yaxis"],
                // 折线区域阴影
                // areaStyle: {
                //   color: "#000"
                // },
                coordinates: item["coordinate"],
                z: 100
            });
        })
        this.echartslayer.setChartOptions(this.options);
    }

    Line.prototype.setVisible = function (bool) {
        this.echartslayer.setVisible(bool);
    }

    Line.prototype.destory = function () {
        this.echartslayer.remove();
    }

    return Line
});